<template>
    <div class="plandetail">
        <el-card v-for="item in list" :key="item.id">
            <h4>{{item.schoolYear}}</h4>
            <ul>
                <li>{{item.grade}}    {{item.major}}     {{item.class}}</li>
                <li>{{item.name}}</li>
                <li>{{item.numberID}}</li>
                <li>{{item.createTime}}</li>
            </ul>
            <el-table :data="item.table" border style="width: 100%">
                <el-table-column prop="text" label="收费项目" ></el-table-column>
                <el-table-column prop="receivable" label="应收金额"></el-table-column>
                <el-table-column prop="netreceipts" label="实收金额"></el-table-column>
                <el-table-column prop="title" label="备注"></el-table-column>
            </el-table>
            <div style="margin-top:10px;">
                <el-button size="small" @click="$router.go(-1)">取消</el-button>
                <el-button size="small" type="info" @click="$router.go(-1)">确定</el-button>
            </div>
        </el-card>
    </div>
</template>
<script>
export default {
  data() {
    return {
      list: [
        {
          id: 1,
          schoolYear: "2018~2019学年",
          major: "移动开发专业",
          class: "01班",
          name: "王楠",
          grade: "2017级",
          numberID: "4578439203294847567",
          createTime: new Date().toLocaleDateString(),
          table: [
            {
              text: "职业技能培养费",
              receivable: "5500.00",
              netreceipts: "5500.00",
              title: ""
            },
            {
              text: "资料费",
              receivable: "300.00",
              netreceipts: "300.00",
              title: ""
            },
            {
              text: "合计金额(小)",
              receivable: "5800.00",
              netreceipts: "5800.00",
              title: ""
            },
            {
              text: "实收金额(大写)",
              receivable: "伍仟捌佰元五角五分",
              netreceipts: "伍仟捌佰元五角五分",
              title: ""
            }
          ],
          examine: "张天",
          collection: "田佳鑫"
        }
      ]
    };
  }
};
</script>
<style lang="scss" scoped>
.plandetail {
  width: 100%;
  padding: 10px;
  h4 {
    color: #5995d7;
  }
  ul{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    margin-top: 15px;
    font-size: 14px;
    margin-bottom: 15px;
  }
}
</style>
